{extend name='index@Common/index' /} {block name='content'}
<div class="card">
    <div class="card-header  border-t pb-0" style="background-color: #fff">
        <div class="tool-list d-flex">
            <ul class="list-inline mr-auto  m-0">
                <li class="list-inline-item p-2" style="border-bottom:3px solid #108cee;">
                    <h4 style="color: #108cee;">VPS管理</h4>
                </li>
            </ul>
        </div>
    </div>
    <div class="card-body fs-12">
        <div class="cont-box">
            <div class="pb-3">
                <div class="form-row m-0">
                    <ul class="list-inline mr-auto m-0 form-inline">
                        <li class="list-inline-item">
                            <div class="input-group input-group-sm">
                                <div class="input-group-addon">
                                    <select name="" id="" class="form-control form-control-sm">
                                    <option value="">服务器名</option>
                                    <option value="">IP</option>
                                  </select>
                                </div>
                                <input class="form-control" placeholder="请输入关键字" type="text">
                            </div>
                        </li>
                        <li class="list-inline-item">
                            <button class="btn btn-primary btn-sm">搜索</button>
                        </li>
                    </ul>
                    <ul class="list-inline m-0 form-inline">
                        <li class="list-inline-item">
                            <a href="{:url('zoneidc/Vpss/add')}" class="btn btn-primary text-white btn-sm">创建VPS</a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="ml-nge">
                <div>
                    <table class="table table-border">
                        <thead class="bg-fB p-2">
                            <tr class="font-weight-light">
                                <th>型号</th>
                                <th>服务器名</th>
                                <th>分配IP</th>
                                <th>开通日期</th>
                                <th>到期日期</th>
                                <th>状态</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            {foreach name="list" item="v"}
                            <tr data-id="{$v.id}" data-name="{$v.name}" data-proid="{$v.product_id}">
                                <td>{$v.product_type}</td>
                                <td>{$v.name}</td>
                                <td>{$v.ip}</td>
                                <td>{$v.create_time}</td>
                                <td>{$v.end_time|date='Y-m-d H:i:s',###}</td>
                                <td>{$v.status}</td>
                                <td>
                                    <a href="javascript:;">编辑</a>
                                    <a href="#changepw" data-toggle="modal">修改密码</a>
                                    <a href="{:url('zoneidc/Vpss/manager',['vpsname'=>$v['name'],'password'=>$v['password']])}" target="_blank">控制面板</a>
                                    <a href="{:url('zoneidc/Vpss/add',['id'=>$v['id'],'name'=>$v['name'],'pro_id'=>$v['product_id'],'type'=>'renew'])}">续费</a>
                                    <a href="{:url('zoneidc/Vpss/add',['id'=>$v['id'],'name'=>$v['name'],'pro_id'=>$v['product_id'],'type'=>'update'])}">升级</a>
                                    <a href="javascript:;">删除</a>
                                </td>
                            </tr>
                            {/foreach}
                        </tbody>
                    </table>
                </div>
                <div class="d-flex justify-content-between pt-3 pl-3">
                    <ul class="mr-auto"></ul>
                    <div class="pagination mb-0">
                        {$list->render()}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{/block} {block name='modal'}
<div class="modal fade" id="changepw" tabindex="-1" role="dialog" aria-labelledby="modelTitleId" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">修改VPS密码</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
            </div>
            <div class="modal-body">
                <div class="form-group row">
                    <label for="vpsname" class="col-sm-3 col-form-label-sm">云服务器名</label>
                    <div class="col-sm-9">
                        <input type="text" readonly disabled class="form-control-plaintext form-control-sm disabled" id="vpsname" name="vpsname">
                        <input type="hidden" readonly disabled class="form-control-plaintext form-control-sm disabled" id="pro_id" name="pro_id">
                    </div>
                </div>
                <div class="form-group row">
                    <label for="password" class="col-sm-3 col-form-label-sm">输入新密码</label>
                    <div class="col-sm-9">
                        <input type="password" class="form-control form-control-sm" id="password" name="password">
                        <span class="help-block">密码必须8位以上,字母+数字</span>
                    </div>
                </div>
                <div class="form-group row">
                    <label for="vpassword" class="col-sm-3 col-form-label-sm">确认新密码</label>
                    <div class="col-sm-9">
                        <input type="password" class="form-control form-control-sm" id="vpassword" name="vpassword">
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-sm btn-primary" onclick="changePwd()">提交</button>
            </div>
        </div>
    </div>
</div>
<div class="">

</div>
{/block} {block name='js'}
<script>
    $('[href="#changepw"]').click(function() {
        $('[name="vpsname"]').val($(this).parents('tr').data('name'));
        $('[name="pro_id"]').val($(this).parents('tr').data('proid'));
    });

    function changePwd() {
        if ($('[name="password"]').val() != $('[name="vpassword"]').val()) {
            alert('新密码与确认密码不同！');
            return false;
        }
        ajax('{:url("zoneidc/Vpss/changepass")}', {
            pro_id: $('[name="pro_id"]').val(),
            vpsname: $('[name="vpsname"]').val(),
            password: $('[name="password"]').val()
        }, 'post').then(e => {
            alert(e.msg);
            $('#changepw').modal('hide');
            console.log(e);
        });
    }
</script>
{/block}